<!--  -->
<template>
  <div>体检项目
   {{ list }}

   <el-table :data="list" style="width: 100%">
    <el-table-column prop="name" label="体检项目" width="180" />
    <el-table-column   label="资料">

     <template #default="scope">
     
     <div v-for="item in scope.row.files">
     {{ imgURL+item }}
        <img  :src="imgURL+item" alt="">
     </div>
       
     </template>
    </el-table-column>
    <el-table-column label="操作" width="180">

 <template #default="scope">

    <el-upload
    class="avatar-uploader"
    :action="baseURL+'/upload/add'"
    :show-file-list="false"
    :headers="headers"
    :on-success="( response:any,uploadFile:any)=>handleAvatarSuccess(scope.$index,response,uploadFile)"
  >
  <el-button type="text" size="small">上传</el-button>
  </el-upload>



    </template>
       
    </el-table-column>
  </el-table>
  </div>
</template>

<script lang='ts' setup>
import { reactive,toRefs,ref,onMounted, inject, watchEffect} from 'vue'
import { CheckUp } from '../../apis/checkup/type';
import { getCheckUpList } from '../../apis/checkup/checkup';
import { UploadProps } from 'element-plus';
import { useAuthSotre } from '../../sotre/authStore';  
import { Elderly } from '../../apis/elderly/type';
const baseURL=ref(import.meta.env.VITE_BASE_URL);
const imgURL=ref(import.meta.env.VITE_IMG_URL);
let store = useAuthSotre();

const list=ref<CheckUp[] | undefined>([]);

const formData=inject<Elderly>("formData")

const headers=reactive({
  Authorization:store.token
})

const getData=async()=>{
  const res=await getCheckUpList();
  list.value=res.list?.map(item=>({...item,files:[]}));
  initData();
}

const initData=()=>{

    if( !list.value?.length || !formData?.checkups?.length) return;

    list.value= list.value!.map(item=>({...item,files:formData?.checkups?.filter(item2=>item2.name==item.name).map((item3:any)=>item3.picture)})) as CheckUp[];

   
}

watchEffect(()=>{

    initData();

})

const editList=()=>{

    let _list:any=[];

    list.value?.forEach((item,index)=>{

        _list=[..._list,...item.files?.map(file=>({name:item.name,picture:file})) ?? []] 
    })

    console.log("处理数据",_list);

    formData!.checkups=_list;
    
}

const handleAvatarSuccess:any= (
    index:number,
  response:any,
  uploadFile:any
) => {
    console.log(index);
    

    console.log("11111",response.data.url);
    if(response.code=='10000'){

        if( list.value?.length){
          list.value[index].files?.push(response.data.url);
        }
    }

    editList();
 
    
  
}


getData();

const upload=(index:number)=>{

    console.log(index);
    
  console.log('上传');
  if( list.value?.length){

    list.value[index].files?.push("aaa.jpg");
 
  }
 
}
</script>
<style scoped>
</style>